@extends('layout.blog')
@section('content')
    <div class="col-md-8 content-main">
        <div class="content-grid">
            <div class="content-grid-head">
                <h4>
                    {{$info->created_at->toDateString()}} {{$info->user->nickname}}
                    @can('edit',$info)
                    <span><a href="/edit/{{$info->id}}"><img src="/blog/images/edit.png" alt=""/></a></span>
                    @endcan
                    @can('delete',$info)
                    <span><a href="/delete/{{$info->id}}"><img src="/blog/images/del.png" alt=""/></a></span>
                    @endcan
                </h4>
                <div class="clearfix"></div>
            </div>
            <div class="content-grid-single">
                <h3>{{$info->title}}</h3>
                <p>{!! $info->content !!}</p>

                <div class="content-form">
                    <h3>留下评论</h3>
                    <form>
                        <input type="text" placeholder="姓名" required/>
                        <input type="text" placeholder="邮箱" required/>
                        <input type="text" placeholder="手机" required/>
                        <textarea></textarea>
                        <input type="submit" value="发布评论" style="float: right;margin-right: 20%"/>
                    </form>
                </div>
                <div class="comments">
                    <h3>评论</h3>
                    <div class="comment-grid">
                        <img src="/blog/images/pic.png" alt=""/>
                        <div class="comment-info">
                            <h4>MARK JOHNSON</h4>
                            <p>Vivamus congue turpis in laoreet sem nec ultrices. Fusce blandit nunc vehicula massa vehicula tincidunt. Nam venenatis cursus urna sed gravida. Ut tincidunt elit ut quam malesuada consequat. Sed semper.</p>
                            <h5>On April 14, 2014, 18:01</h5>
                            <a href="#">回复</a>
                        </div>
                        <div class="clearfix"></div>
                    </div>

                    <div class="pages">
                        <ul>
                            <li class="active"><a href="#">1</a></li>
                            <li><a href="#">2</a></li>
                            <li><a href="#">3</a></li>
                            <li><a href="#">4</a></li>
                            <li><a href="#">5</a></li>
                            <li><a href="#">6</a></li>
                            <li><a href="#">Previous</a></li>
                            <li><a href="#">Next</a></li>
                        </ul>
                    </div>

                </div>
            </div>

        </div>
    </div>

@endsection

